<template>
  <div class="containers">
    <div class="container">
		<el-table :data="tableData" ref="table" style="width: 100%" 
			 v-loading="loading">

			<el-table-column prop="name" label="页面名称"> </el-table-column>
			<el-table-column label="操作" width="180" align="center">
          <template slot-scope="scope">
            <el-button type="text" @click="copy(scope.row.path)">复制</el-button>            
          </template>
        </el-table-column>
		</el-table>
	</div>
	</div>
</template>
<script>
export default {
	data() {
		return {
			tableData: [
				{
					name:'商家联盟',
					path:'/pages/business/index'
				},
				{
					name:'公告列表',
					path:'/pages/index/notice'
				},
				{
					name:'商品分类',
					path:'/pages/commodity/category'
				}
				
			],
			keyword: '',
      loading:false
		}
	},
	created() {
	},
	methods: {
    copy(row) {
      // 创建一个input框
      const input = document.createElement('input')
      // 将指定的DOM节点添加到body的末尾
      document.body.appendChild(input)
      // 设置input框的value值为复制的值
      const address = row
      input.setAttribute('value', address)
      // 选取文本域中的内容
      input.select()
      // copy的意思是拷贝当前选中内容到剪贴板
      // document.execCommand（）方法操纵可编辑内容区域的元素
      // 返回值为一个Boolean，如果是 false 则表示操作不被支持或未被启用
      if (document.execCommand('copy')) {
        document.execCommand('copy')
      }
      // 删除这个节点
      document.body.removeChild(input)
      // 弹窗：复制成功
      this.$message.success('复制成功');
      // 
    },
	},
}
</script>
<style>
.contair{
	padding: 20px;
}
</style>